import 'dart:io';

import 'package:situation/app/theme/app_theme.dart';
import 'package:situation/app/theme/gaps.dart';
import 'package:situation/data/store/config_store.dart';
import 'package:situation/domain/intell/IntellAnnex.dart';
import 'package:situation/shared/util/util_mk.dart';
import 'package:situation/widgets/PlayVideo.dart';
import 'package:situation/widgets/app/app_input.dart';
import 'package:situation/widgets/app/app_title.dart';
import 'package:situation/widgets/mk_load_image.dart';
import 'package:situation/widgets/mk_scroll_view.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart' hide TDInput, TDInputType;

import 'controller.dart';

class PublishIntellPage extends StatefulWidget {
  const PublishIntellPage({Key? key}) : super(key: key);

  @override
  State<PublishIntellPage> createState() => _PublishIntellPageState();
}

class _PublishIntellPageState extends State<PublishIntellPage> {
  final controller = Get.find<PublishIntellController>();
  final state = Get.find<PublishIntellController>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: TDNavBar(title: '发布情报'),
      body: MkScrollView(
        bottomButton: TDButton(
          text: '确认上报',
          shape: TDButtonShape.circle,
          height: 48,
          onTap: controller.publish,
          isBlock: true,
          theme: TDButtonTheme.primary,
        ),
        children: [
          Gaps.vGap16,
          Padding(
            padding: EdgeInsets.only(left: AppTheme.iDefaultPadding),
            child: AppTitle(title: '请填写基本信息'),
          ),
          Gaps.vGap16,
          TDInput(
            controller: controller.typeController,
            leftLabel: '类型',
            required: true,
            readOnly: true,
            type: TDInputType.special,
            textAlign: TextAlign.end,
            backgroundColor: Colors.transparent,
          ),
          Obx(
            () => TDCell(
              arrow: true,
              required: true,
              noteWidget:
                  state.addressName != ''
                      ? _noteWidget('')
                      : _noteWidget('请选择地理位置'),
              description: state.addressName == '' ? '' : state.addressName,
              title: '地理位置',
              onClick: controller.addressSelect,
            ),
          ),

          TDInput(
            controller: controller.phoneController,
            required: true,
            maxLength: 11,
            leftLabel: '手机号',
            type: TDInputType.special,
            textAlign: TextAlign.end,
            backgroundColor: Colors.transparent,
            hintText: '请输入手机号',
            inputType: TextInputType.phone,
          ),

          Obx(
            () => TDCell(
              arrow: true,
              bordered: true,
              required: true,
              noteWidget:
                  state.upTime == ''
                      ? _noteWidget('请选择时间')
                      : _noteWidget(state.upTime),
              title: '上报时间',
              onClick: controller.showUpTimeSelect,
            ),
          ),

          TDInput(
            controller: controller.detailController,
            maxLength: 200,
            leftLabel: '详情',
            type: TDInputType.special,
            textAlign: TextAlign.end,
            backgroundColor: Colors.transparent,
            hintText: '请输入详细信息',
            inputType: TextInputType.phone,
          ),

          // 上传图片或者商品
          Padding(
            padding: EdgeInsets.all(AppTheme.iDefaultPadding + 4),
            child: Row(
              children: [Text('添加图片/视频', style: TextStyle(fontSize: 16))],
            ),
          ),

          Obx(()=>Container(
            margin: EdgeInsets.symmetric(
              horizontal: AppTheme.iDefaultPadding + 4,
            ),
            child: Wrap(
              alignment: WrapAlignment.start,
              spacing: 8,
              children: [
                GestureDetector(
                  onTap: controller.onFileAdd,
                  child: Container(
                    width: (Get.width - 60) / 4,
                    height: (Get.width - 60) / 4,
                    decoration: BoxDecoration(
                      color: Colors.grey.withAlpha(120),
                    ),
                    child: Icon(Icons.add),
                  ),
                ),

                for(var i =0; i < state.imgList.length; i++) ...[
                  _buildImageBox(state.imgList[i], i)
                ],

                state.video.path == null ? SizedBox(): GestureDetector(
                  onTap: (){
                    UtilMk.openBottomSheet(
                      480,
                      "视频",
                      Container(
                        height: 400,
                        clipBehavior: Clip.hardEdge,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(
                            AppTheme.iDefaultRadius * 2,
                          ),
                        ),
                        child: PlayVideo(url: ConfigStore.to.baseFileUrl  + state.video.path!),
                      ),
                    );
                  },
                  child: Container(
                    width: (Get.width - 60) / 4,
                    height: (Get.width - 60) / 4,
                    decoration: BoxDecoration(
                      color: Colors.grey.withAlpha(120),
                    ),
                    child: Stack(
                      alignment: Alignment.center,
                      children: [
                        Image.file(File(state.videoThumb)),
                        Positioned(
                          right: 0,
                          top: 0,
                          child: GestureDetector(
                            onTap: (){
                              state.video = IntellAnnex();
                            },
                            child: Container(
                              width: 20,
                              height: 20,
                              decoration: const BoxDecoration(
                                color: Color.fromRGBO(0, 0, 0, 0.6),
                                borderRadius: BorderRadius.only(
                                  bottomLeft: Radius.circular(6),
                                  topRight: Radius.circular(6),
                                ),
                              ),
                              child: const Center(
                                child: Icon(TDIcons.close, size: 20, color: Colors.white),
                              ),
                            ),
                          ),
                        ),

                        Positioned(
                          child: Icon(Icons.play_circle_outline,size: 40,color: Colors.black.withAlpha(150),),
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          )),
        ],
      ),
    );
  }

  Widget _buildImageBox(IntellAnnex image, i) {
    return GestureDetector(
      onTap: () {
        TDImageViewer.showImageViewer(context: context, images: [ConfigStore.to.baseFileUrl  + image.path!]);
      },
      child: Stack(
        children: [
          MkLoadImage(
            ConfigStore.to.baseFileUrl  + image.path!,
            width: (Get.width - 60) / 4,
            height: (Get.width - 60) / 4,
          ),
          Positioned(
            right: 0,
            top: 0,
            child: GestureDetector(
              onTap: (){
                controller.removeImg(i);
              },
              child: Container(
                width: 20,
                height: 20,
                decoration: const BoxDecoration(
                  color: Color.fromRGBO(0, 0, 0, 0.6),
                  borderRadius: BorderRadius.only(
                    bottomLeft: Radius.circular(6),
                    topRight: Radius.circular(6),
                  ),
                ),
                child: const Center(
                  child: Icon(TDIcons.close, size: 20, color: Colors.white),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  _noteWidget(text) {
    return Text(text, style: TextStyle(fontSize: 16));
  }

  @override
  void dispose() {
    Get.delete<PublishIntellController>();
    super.dispose();
  }
}
